<template>
	<view class="info">
		<!-- 轮播 -->
		<view class="shuttle">
			<uni-swiper-dot :info="bannerList" :current="bannerCurrent" mode="round" :dotsStyles="dotsStyles">
				<swiper class="shuttle_swiper" :autoplay="true" :interval="3000" :circular="true"
					@change="swiperChange">
					<swiper-item class="shuttle_swiper" v-for="(item, index) in bannerList" :key="index">
						<image @click="goNext('/pagesA/info/newsinfo?type=universal&id='+item.id, false)"
							class="shuttle_img" :src="http_img+item"></image>
						<view class="shuttle_title font-ffffff font14">{{dataobj.name}}</view>
					</swiper-item>
				</swiper>
			</uni-swiper-dot>
		</view>
		<!-- 电话 -->
		<view class="info_phone flex-row-between">
			<view class="font14 font-323232 font-b">体检咨询&预约电话</view>
			<view class="flex-row-start phone_bos" @click="Onphone">
				<view class="font14 font-646464">{{conobj.physical_h_tel}}</view>
				<image src="../../../static/my/morea.png" mode=""></image>
			</view>
		</view>
		<!-- 边框 -->
		<view class="com_border"></view>
		<!-- 切换 -->
		<view class="index_head">
			<view v-for="(item,index) in headlist" :key="index" class="head_bos flex-column-center"
				@click="Onhead(item)">
				<text :class="headindex == item.id?'head_titlea':'head_titleb'">{{item.title}}</text>
				<view v-if="headindex == item.id"></view>
			</view>
		</view>
		<!-- 套餐详情 -->
		<view class="package_info flex-column-center" v-if="headindex==1">
			<view v-for="(item,index) in packageList" :key="index" class="package_list">
				<view class="package_title font14 font-323232 flex-row-center">{{item.name}}({{item.physical_project_number}})项</view>
				<view class="package_bos">
					<view class="package_box font14 font-646464" v-for="(item1,index1) in item.physical_project" :key="index"
						:class="index1==item.physical_project.length-1?'package_box_0':''">
						<view class="package_box_title">{{item1.name}}</view>
						<view class="package_box_info">{{item1.synopsis}}</view>
					</view>
				</view>
			</view>
			<view class="font14 font-323232 margin1">体检详情</view>
			<rich-text :nodes="dataobj.details"></rich-text>
		</view>
		<!-- 体检须知 -->
		<view v-if="headindex==2" class="package_info">
			<rich-text :nodes="dataobj.notice"></rich-text>
		</view>
		<!-- 立即预约 -->
		<view class="pay_menu flex-row-between">
			<view>
				<view class="font-b flex-row-start">
					<view class="font13 font-1e1e1e width_76">合计:</view>
					<text class="font-ff3c37 font15">
						<text class="font11">￥</text>{{dataobj.price}}</text>
				</view>
			</view>
			<view class="menu_submit flex-row-center font-ffffff font13" @click="OnSubmit">立即预约</view>
		</view>
		<view class="pay_menus"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				conobj:{},
				id: null,
				dataobj:{},
				//轮播参数
				bannerCurrent: 0,
				bannerList: [],
				dotsStyles: {
					width: 3,
					height: 3,
					backgroundColor: 'rgba(51, 51, 51, .3)',
					border: '1px rgba(51, 51, 51, .3) solid',
					selectedBackgroundColor: '#6bcbb6',
					selectedBorder: '1px #6bcbb6 solid'
				},
				headindex: 1,
				headlist: [{
						title: '套餐详情',
						id: 1
					},
					{
						title: '体检须知',
						id: 2
					}
				],
				// 套餐详情
				packageList: [],
				http_img: ''
			}
		},
		onLoad: function(options) {
			this.id = options.id
			this.http_img = this.$store.state.http_img
			//获取详情
			this.OnInfo()
			//公共接口
			this.Onconfig()
		},
		methods: {
			Onconfig() {
				this.$Http({
					url: 'consultationConsult',
					data: {}
				}).then(res => {
					if (res.code == 1) {
						this.conobj = res.data
					}
				})
			},
			//获取详情
			OnInfo() {
				this.$Http({
					url: 'physicalDetails',
					data: {
						physical_id: this.id
					}
				}).then(res => {
					if (res.code == 1) {
						this.packageList = res.data.physical_project
						res.data.notice = res.data.notice?res.data.notice.replace(/\<img/g,'<img style="display: block;max-width: 100%;height: auto;"'):''
						res.data.details = res.data.details?res.data.details.replace(/\<img/g,'<img style="display: block;max-width: 100%;height: auto;"'):''
						this.dataobj = res.data
						this.bannerList = res.data.banner
					}
				})
			},
			//切换
			Onhead(res) {
				this.headindex = res.id
			},
			//去预约
			OnSubmit() {
				uni.navigateTo({
					url: '/pagesA/check/make/make?id='+this.id,
				})
			},
			//拨打电话
			Onphone(e){
				uni.makePhoneCall({
				    phoneNumber: this.conobj.physical_h_tel //仅为示例
				});
			}
		}
	}
</script>

<style lang="less">
	@import url("info.less");
</style>
